//var zombie
var images = {}; 
loadImage("zombie-leftArm");
loadImage("zombie-legs");
loadImage("zombie-torso"); 
loadImage("zombie-rightArm");
loadImage("zombie-head"); 
loadImage("zombie-hair"); 
loadImage("zombie-leftArm-jump"); 
loadImage("zombie-legs-jump"); 
loadImage("zombie-rightArm-jump");
var totalResources = 9; 
var numResourcesLoaded = 0; 
var fps = 30; 
var charX = 245; 
var charY = 185;
var breathInc = 0.1; 
var breathDir = 1; 
var breathAmt = 0; 
var breathMax = 2; 
var breathInterval = setInterval(updateBreath, 1000 / fps);
var maxEyeHeight = 14; 
var curEyeHeight = maxEyeHeight; 
var eyeOpenTime = 0; 
var timeBtwBlinks = 4000; 
var blinkUpdateTime = 200; 
var blinkTimer = setInterval(updateBlink, blinkUpdateTime);
var jumping = false;

//var ball
var canvas,
 context,
 canvasWidth = 490,
 canvasHeight = 220,
 images = {},
 frameInterval,
 fps = 30,
 drawing = false,
 fpsInterval,
 numFramesDrawn = 0,
 curFPS = 0,
 level = 1,
 maxLevel = 6,
 speed = (Math.random()*100),
 curLoadResNum = 0,
 totalLoadResources = 1,
 displayList = [],
 ball,
 hero,
 background;
 Ball = function() {
 var x = 0,
 y = 0,
 speed = 0, 
 direction = 1, 
 rollTimer, 
 dirty = false, 
 diameter = 20, 
 color = "#DD3333",
 highlightColor = "#fa6565";
 rollTimer = setInterval(updateRoll, 1000/25);
 
//function zombie

function prepareCanvas(canvasDiv, canvasWidth, canvasHeight) { 
canvas = document.createElement('canvas'); 
canvas.setAttribute('width', canvasWidth); 
canvas.setAttribute('height', canvasHeight); 
canvas.setAttribute('id', 'canvas'); 
canvasDiv.appendChild(canvas); 
if(typeof G_vmlCanvasManager != 'undefined') { 
canvas = G_vmlCanvasManager.initElement(canvas); 
} 

context = document.getElementById('canvas').getContext("2d"); 
 start();

 ball = new Ball();
 ball.setX(canvasWidth);
 ball.setY(200);
 ball.roll(speed, -1);
 displayList.push(ball);

}

function clearCanvas() {
 canvas.width = canvas.width; // clears the canvas 
}


function loadImage(name) 
{ 
images[name] = new Image(); 
images[name].onload = function() { 
resourceLoaded(); 
} 
images[name].src = "zombie/" + name + ".png"; 
}

function resourceLoaded() 
{ 
numResourcesLoaded += 1; 
if(numResourcesLoaded === totalResources) { 
setInterval(redraw, 1000 / fps); 
} 
} 

function redraw() { 
var x = charX; 
var y = charY; 
var jumpHeight = 45;
canvas.width = canvas.width; // clears the canvas 
// Draw shadow 
 if (jumping) { 
 drawEllipse(x + 40, y + 29, 100 - breathAmt, 4); 
 } else { 
 drawEllipse(x + 40, y + 29, 160 - breathAmt, 6); 
 } 
 if (jumping) { 
 y -= jumpHeight; 
 } 
 if (jumping) { 
 context.drawImage(images["zombie-leftArm-jump"], x + 40, y - 42 - breathAmt); 
 } else { 
 context.drawImage(images["zombie-leftArm"], x + 40, y - 42 - breathAmt); 
 }
if (jumping) { 
 context.drawImage(images["zombie-legs-jump"], x, y- 6); 
 } else { 
 context.drawImage(images["zombie-legs"], x, y); 
 }
context.drawImage(images["zombie-torso"], x, y - 50); 
context.drawImage(images["zombie-head"], x - 10, y - 125 - breathAmt); 
context.drawImage(images["zombie-hair"], x - 37, y - 138 - breathAmt); 
if (jumping) {
 context.drawImage(images["zombie-rightArm-jump"], x - 35, y - 42 - breathAmt); 
 } else { 
 context.drawImage(images["zombie-rightArm"], x - 15, y - 42 - breathAmt); 
 }
drawEllipse(x + 47, y - 68 - breathAmt, 8, curEyeHeight); 
drawEllipse(x + 58, y - 68 - breathAmt, 8, curEyeHeight);
}

function drawEllipse(centerX, centerY, width, height) { 
 context.beginPath(); 
 context.moveTo(centerX, centerY - height/2); 
 context.bezierCurveTo( 
 centerX + width/2, centerY - height/2, 
 centerX + width/2, centerY + height/2, 
 centerX, centerY + height/2 
 ); 
 context.bezierCurveTo( 
 centerX - width/2, 
 centerY + height/2, 
 centerX - width/2, 
 centerY - height/2, centerX, centerY - height/2 
 ); 

 context.fillStyle = "black"; 
 context.fill(); context.closePath(); 
}

function updateBreath() { 
 if (breathDir === 1) { // breath in 
 breathAmt -= breathInc; 
if (breathAmt < -breathMax) { 
 breathDir = -1; 
 } 
 } else { // breath out 
 breathAmt += breathInc; 
 if(breathAmt > breathMax) { 
 breathDir = 1; 
 } 
 } 
}

function updateBlink() { 
 eyeOpenTime += blinkUpdateTime; 
 if(eyeOpenTime >= timeBtwBlinks){ 
 blink(); 
 } 
} 
function blink() { 
 curEyeHeight -= 1; 
 if (curEyeHeight <= 0) { 
 eyeOpenTime = 0; curEyeHeight = maxEyeHeight; 
 } else { 
 setTimeout(blink, 10); 
 } 
}
function jump() { 
 if (!jumping) { 
 jumping = true; 
 setTimeout(land, 500); 
 } 
}

function land() { 
 jumping = false; 
}

//function ball

function roll(pSpeed, pDirection){
 speed = pSpeed;
 if(pDirection){
 direction = pDirection;
 }
}
function stop() {
 speed = 0;
 }
 function updateRoll() {
 x += direction * speed;
 }
 
function draw(context) {
 
 var centerX = x,
 centerY = y + (diameter + 10)/2 - 2,
 width = (diameter + 30),
 height = 6;
 
 context.beginPath();
 context.moveTo(centerX, centerY);
 context.bezierCurveTo(centerX-width/2,centerY-height/2,
   centerX-width/2,centerY+height/2,
   centerX,centerY+height/2);
 context.bezierCurveTo(centerX+width/2,centerY+height/2,
   centerX+width/2,centerY-height/2,
   centerX,centerY-height/2);
 context.fillStyle = "#000000";
 context.fill();
 context.closePath();
 
 context.beginPath();
 context.moveTo(x, y - (diameter + 10)/2);
 context.arc(x,y,(diameter + 10)/2,0,2*Math.PI,false);
 context.fillStyle = "#000000";
 context.fill();
 context.closePath();
 
 context.beginPath();
 context.moveTo(x, y - diameter/2);
 context.arc(x,y,diameter/2,0,2*Math.PI,false);
 context.fillStyle = color;
 context.fill();
 context.closePath();
 
 centerX = x + 3;
 centerY = y - 3;
 context.beginPath();
 context.moveTo(centerX, centerY);
 context.arc(centerX,centerY,diameter/3/2,0,2*Math.PI,false);
 context.fillStyle = highlightColor;
 context.fill();
 context.closePath();
 }
 function getX(){
 return x; 
 }
 function setX(pX){
 x = pX; 
 }
 function getY(){
 return y; 
 }
 function setY(pY){
 y = pY; 
 }
 return {
 getX:getX,
 setX:setX,
 getY:getY,
 setY:setY,
 roll:roll,
 draw:draw,
 stop:stop
 };
 };
 
function throwBall() { 
 ball.roll(speed, -1);
}

function start() {
 frameInterval = setInterval(update, 1000/fps);
 fpsInterval = setInterval(updateFPS, 1000);
}

function update() {
 
 ++numFramesDrawn;

  if(ball.getX() < 0) {
 
 speed = (Math.random()*100);
 level += 1;

 ball.stop();
 ball.setX(canvasWidth + 20);
 setTimeout(throwBall, Math.random() * 3000);
 } 
 else {
 ball.roll(speed, -1);
 }
 redrawball(); 
}

function redrawball() {
 
 var i;
 
 clearCanvas();
 
 for(i = 0; i < displayList.length; i++)
 {
 displayList[i].draw(context); 
 
 }
 
 try {
 
 } catch (ex) {
 
 }
 
}

function updateFPS()
{
 curFPS = numFramesDrawn;
 numFramesDrawn = 0;